// 好房管理 公共table 配置
import { computed, reactive } from 'vue'

export function useTable() {
    const tabConfig = reactive<any>({
        currentPage: 1,
        data: [],
        index: 0,
        loading: false,
        pageSize: 10,
        total: 0,
    })

    const cols = [
        [ // 好房诚意金
            { slots: { checkbox: 'checkbox_cell', header: 'checkbox_header' }, type: 'checkbox', width: 60 },
            { field: 'code', title: '订单编号' },
            { field: 'code', title: '提交时间' },
            { field: 'louc', title: '用户账户' },
            { field: 'code', title: '姓名' },
            { field: 'group_name', title: '联系方式' },
            { field: 'group_name', title: '意向金订单金额', width: 120 },
            { field: 'group_name', title: '支付方式' },
            { slots: { default: 'status' }, title: '订单状态' },
            { slots: { default: 'operate' }, title: '操作', width: 300 },
        ],
        [ // 退款申请处理
            { slots: { checkbox: 'checkbox_cell', header: 'checkbox_header' }, type: 'checkbox', width: 60 },
            { field: 'group_name', title: '服务单号' },
            { field: 'dongbh', title: '申请时间' },
            { field: 'group_name', title: '退款金额' },
            { field: 'code', title: '支付方式' },
            { slots: { default: 'status' }, title: '订单状态' },
            { slots: { default: 'operate' }, title: '操作', width: 300 },
        ],
        [ // 好房合同
            { slots: { checkbox: 'checkbox_cell', header: 'checkbox_header' }, type: 'checkbox', width: 60 },
            { field: 'fangh', title: '合同编号' },
            { field: 'code', title: '合同名称' },
            { field: 'code', title: '合同类型' },
            { field: 'code', title: '合同金额' },
            { field: 'code', title: '商家金额' },
            { slots: { default: 'status' }, title: '合同状态' },
            { field: 'suosqy', title: '出卖人' },
            { field: 'code', title: '买受人' },
            { field: 'code', title: '处理时间' },
            { field: 'suosqy', title: '金额是否异常', width: 120 },
            { slots: { default: 'operate' }, title: '操作', width: 300 },
        ],
    ]

    const xGrid = ref<any>()
    const gridOptions = computed(() => {
        const { currentPage, data, index, loading, pageSize, total } = tabConfig
        const columns = cols[index]
        return {
            border: true,
            columnConfig: {
                resizable: true,
            },
            columns,
            data,
            editConfig: {
                mode: 'row',
                showStatus: true,
                trigger: 'manual',
            },
            height: 530,
            keepSource: true,
            loading,
            pagerConfig: {
                currentPage,
                enabled: true,
                pageSize,
                pageSizes: [10, 20, 50, 100, 200, 500],
                total,
            },
            showOverflow: true,
        }
    })

    const commonBtn: any = [
        {
            label: '查看',
            text: true,
            value: 1,
        },
        {
            label: '退款',
            text: true,
            value: 2,
        },

    ]

    const allBtn: any = [
        [
            {
                label: '查看',
                text: true,
                value: 1,
            },
            {
                label: '关闭订单',
                text: true,
                value: 2,
            },
            {
                label: '取消订单',
                text: true,
                value: 3,
            },
        ],
        commonBtn,
        commonBtn,
    ]

    // 表格操作栏按钮
    const btns = computed(() => {
        return allBtn[tabConfig.index]
    })

    const data: any = [{
        orderId: '',
        orderName: '',
        orderState: '',
        submitDate: '',
    }, {
        orderId: '',
        orderState: '',
        submitDate: '',
    }, {
        orderId: '',
        orderState: '',
        submitDate: '',
    }]
    const state = computed(() => {
        return data[tabConfig.index]
    })

    const tags: any = [
        { text: '待付款', type: 'danger' },
        { text: '已签约', type: 'success' },
        { text: '已付款', type: 'warning' },
        { text: '已关闭', type: 'info' },
    ]

    return { btns, gridOptions, state, tabConfig, tags, xGrid }
}
